@extends('layouts.back_stage')
@section('content')
    <link href="{{env('CDN_DOMAIN_NAME')}}/store/commoncss/simplePagination.css" rel="stylesheet">
    <link rel="stylesheet" href="{{env('CDN_DOMAIN_NAME')}}/css/commoncss/just-tip.css">
    <script src="{{env('CDN_DOMAIN_NAME')}}/js/commonjs/justTools.js"></script>
    <style>
        .shopBg{padding:0 50px;height:50px;position:relative;}
        .init{width:400px;display:inline-block;margin-left:10px;}
        .tableBg{padding:30px 0;height:auto;}
        .tabInfo{width:100%;height:100%;}
        /*.tabInfo{width:100%;height:100%;overflow-y:scroll;}*/
        .countN{display:inline-block;margin-left:50px;margin-top:9px;}

        .address {
            border-color: #cfdadd;border-radius: 2px;width: 150px;
            height: 30px;padding: 6px 10px;font-size: 13px;line-height: 1.42857143;margin-right:10px;
            color: #555;background-color: #fff;background-image: none;border: 1px solid #cfdadd;box-shadow: none;
            -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
            -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        }
        .form-control, .single-line{font-size:13px;}
    </style>
    <div class="container">
        <audio id="music_success" src="{{env('CDN_DOMAIN_NAME')}}/store/mp3/success.mp3" type="audio/mp3"></audio>
        <audio id="music_faile" src="{{env('CDN_DOMAIN_NAME')}}/store/mp3/faile.mp3" type="audio/mp3"></audio>
        <div style="padding:20px 0;margin-bottom:30px;"><h3 style="float:left;">扫描核对</h3></div>
        <div class="shopBg">
            <div style="width:550px;float:left;height:50px;">
                @if($sub_info->is_check==1)

                @else
                    <label>扫码:</label>
                    <input type="text" class="form-control init" autocomplete="off" autocorrect="off" value="" name="" placeholder="请扫码" />
                    <a href="javascript:;" class="btn btn-info sureS" style="margin-bottom:3px;">确认</a>
                @endif
            </div>
            <div class="countN">店长退货总计：<span>{{$no_scan_count}}</span>件</div>
            <div class="countN">扫码核对总计：<span class="overOld">{{$scan_count}}</span>件</div>
        </div>
        <div class="pull-left" style="width:90%;margin:30px 50px;">
            <label>已扫商品编码：</label>
            <input type="text" class="form-control codes" placeholder="请输入已扫码的商品编码" style="width:200px;display: inline-block">
            <label>状态：</label>
            <select class="address status">
                <option value="">请选择状态</option>
                <option value="1">已扫码</option>
                <option value="-1">未扫码</option>
            </select>
            <button onclick="souSan()" class="btn btn-info" style="margin-bottom:4px;">搜索</button>
            <button onclick="reSetScan()" class="btn btn-info" style="margin-bottom:4px;">清空</button>
        </div>
        <div class="tableBg">
            <div class="tabInfo">
                <p style="float: left;"><i class="fa fa-check" style="color:#1aad1a;"></i>：核对成功； <i class="fa fa-minus"></i>：未核对； </p>
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th>状态</th>
                        <th>品牌</th>
                        <th>商品编码</th>
                        <th>款号</th>
                        <th>尺码</th>
                        <th>颜色</th>
                        <th>价格/元</th>
                    </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>
                <div id="paging1" class="page" style=""></div>
            </div>
        </div>
        @if($sub_info->is_check==1)

        @else
            <button style="float:right;" type="button" class="btn btn-info overBrand" onclick="overBrand()">核对完成</button>
        @endif
    </div>
    <script src="{{ env('CDN_DOMAIN_NAME') }}/store/commonjs/jquery.simplePagination.js?v0.0.3"></script>
    <script>
        $(".overBrand").mouseover(function(event){
            var _this = $(this);
            _this.justToolsTip({
                events:event,
                animation:"moveInLeft",
                //width:"300px",
                contents:"请确保扫描核对正确，再点击此按钮",
                gravity:'left'
            });
        });
        /*搜索*/
        function souSan(){
            skip=1;
            pervNextSerach();
        };
        /*清空*/
        function reSetScan(){
            skip=1;
            $('.form-control').val("");
            $('.address').val("");
            pervNextSerach();
        };
        /*点击分页*/
        $(document).on('click','.page-link',function(){
            if($(this).attr('class') === "page-link next nextPage"){
                if($(this).parent().attr('class') == 'active'){
                    return false;
                }else{
                    skip=Number(skip)+1;
                    pervNextSerach();
                }
            }else if($(this).attr('class') === "page-link prev prevPage"){
                if($(this).parent().attr('class') == 'active'){
                    return false;
                }else{
                    skip=Number(skip)-1;
                    pervNextSerach();
                }
            }else if($(this).attr('class') === "page-link tcdNumber"){
                skip=Number($(this).text());
                pervNextSerach();
            }
        });

        /*页面初始化*/
        var skip = 1;
        pervNextSerach();
        function pervNextSerach(){
            var small_qr=$(".codes").val();
            var status=$(".status").val();
            var sub_id ='{{$sub_id}}';
            $.ajax({
                url:'/warehouse/scan-qrcode-details',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
                },
                type:'post',
                dataType:'json',
                data:{
                    skip:skip,
                    sub_id:sub_id,
                    status:status,
                    small_qr:small_qr
                },
                success:function(data){
                    //console.log(data);
                    if(data.result.success){
                        $(".table tbody").empty();
                        var res=data.content.cont;
                        if(res.length>0){
                            for(var i in res){
                                if(res[i].status==1){
                                    var str='<tr class="text-left tr'+res[i].id+'" style="background:#1aad1a;color: #fff;">' +
                                        '<td class="iconTd"><i class="fa fa-check"></i></td>' +
                                        '<td>'+res[i].brand+'</td>' +
                                        '<td class="qr_code">'+res[i].small_qr+'</td>' +
                                        '<td>'+res[i].girard+'</td>' +
                                        '<td>'+res[i].size+'</td>' +
                                        '<td>'+res[i].color+'</td>' +
                                        '<td>'+res[i].price+'</td>' +
                                        '</tr>';
                                }else if(res[i].status==-1){
                                    var str='<tr class="text-left tr'+res[i].id+'">' +
                                        '<td class="iconTd"><i class="fa fa-minus"></i></td>' +
                                        '<td>'+res[i].brand+'</td>' +
                                        '<td class="qr_code">'+res[i].small_qr+'</td>' +
                                        '<td>'+res[i].girard+'</td>' +
                                        '<td>'+res[i].size+'</td>' +
                                        '<td>'+res[i].color+'</td>' +
                                        '<td>'+res[i].price+'</td>' +
                                        '</tr>';
                                }
                                $(".table tbody").append(str);
                            }
                        }else{
                            $(".table tbody").append("<tr><td class='text-center' colspan='7'>无数据</td></tr>");
                        }
                        $("#paging1").pagination({
                            items: data.content.total,
                            itemsOnPage: 10,
                            cssStyle: 'light-theme',
                            currentPage:data.content.skip
                        });
                    }else{
                        $(".faceImg").attr("src","/img/weep.png");
                        $(".oHandle").text(data.result.errorMsg);
                        $(".oSuccess").show(0).delay(1000).hide(0);
                    }
                }
            });
        }
        /*input实时监控*/
        $(".init").on("input",function(){
            var small_qr = $('.init').val().trim();
            var sub_id ='{{$sub_id}}';
            if(small_qr.length !=15){
                return false;
            }
            $('.init').val('');
            if (small_qr != '') {
                $.ajax({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
                    },
                    type: 'post',
                    url: '/warehouse/scan-qrcode',
                    data: {
                        sub_id:sub_id,
                        small_qr:small_qr
                    },
                    success: function (data) {
                        //console.log(data);
                        if(data.result.success){
                            $(".faceImg").attr("src","/img/laugh.png");
                            $(".oHandle").text("核对成功");
                            $(".oSuccess").show(0).delay(1000).hide(0);
                            $(".tr"+data.content.id).children(".qr_code").empty();
                            $(".tr"+data.content.id).children(".iconTd").empty();
                            if(data.content.status==1){
                                $(".tr"+data.content.id).css({"background":"#1aad1a","color":"#fff"});
                                $(".tr"+data.content.id).children(".qr_code").text(data.content.small_qr);
                                $(".tr"+data.content.id).children(".iconTd").append('<i class="fa fa-check"></i>');
                            }
                            var n=$(".overOld").text();
                            $(".overOld").empty();
                            $(".overOld").text( Number(n)+1 );
                            var music = document.getElementById("music_success");
                            music.play()
                        }else{
                            var music = document.getElementById("music_faile");
                            music.play()
                            $(".faceImg").attr("src","/img/weep.png");
                            $(".oHandle").text(data.result.errorMsg);
                            $(".oSuccess").show(0).delay(1000).hide(0);
                        }
                    }
                })
            }
        });
        /*点击确认*/
        $(".sureS").click(function(){
            var small_qr = $('.wornCode').val().trim();
            var sub_id ='{{$sub_id}}';
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
                },
                type: 'post',
                url: '/warehouse/scan-qrcode',
                data: {
                    sub_id:sub_id,
                    small_qr:small_qr
                },
                success: function (data) {
                    if(data.result.success){
                        $(".faceImg").attr("src","/img/laugh.png");
                        $(".oHandle").text("核对成功");
                        $(".oSuccess").show(0).delay(1000).hide(0);
                        $(".tr"+data.content.id).children(".qr_code").empty();
                        $(".tr"+data.content.id).children(".iconTd").empty();
                        if(data.content.status==1){
                            $(".tr"+data.content.id).css({"background":"#1aad1a","color":"#fff"});
                            $(".tr"+data.content.id).children(".qr_code").text(data.content.small_qr);
                            $(".tr"+data.content.id).children(".iconTd").append('<i class="fa fa-check"></i>');
                        }
                        var n=$(".overOld").text();
                        $(".overOld").empty();
                        $(".overOld").text( Number(n)+1 );
                        var music = document.getElementById("music_success");
                        music.play()
                    }else{
                        var music = document.getElementById("music_faile");
                        music.play()
                        $(".faceImg").attr("src","/img/weep.png");
                        $(".oHandle").text(data.result.errorMsg);
                        $(".oSuccess").show(0).delay(1000).hide(0);
                    }
                }
            })
        });
        /*扫描完成*/
        function overBrand() {
            $(".oText").text("确定完成吗？");
            $(".oMask").show();
            $(".oAnim").show();
            $(".oBtn0").attr('id','');
            $(".oBtn0").attr('id','overTrues');
        }
        /*点确定*/
        $(document).on('click','#overTrues',function(){
            $(".oMask").hide();
            $(".oAnim").hide();
            var sub_id ='{{$sub_id}}';
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
                },
                type:'post',
                url:'/warehouse/sub-complete',
                data:{
                    sub_id:sub_id
                },
                dataType:'json',
                success:function (data) {
                    console.log(data);
                    if(data.result.success){
                        $(".faceImg").attr("src","/img/laugh.png");
                        $(".oHandle").text("操作成功");
                        $(".oSuccess").show(0).delay(800).hide(0);
                        setTimeout(function () {
                            window.location.href='/warehouse/return-order-lists/'+data.content;
                        },800)
                    }else{
                        $(".faceImg").attr("src","/img/weep.png");
                        $(".oHandle").text(data.result.errorMsg);
                        $(".oSuccess").show(0).delay(1000).hide(0);
                    }
                }
            });
        });
    </script>
@endsection




